/**
 * 解决子组件直接修改父组件值，避免打破单向数据流
 * @param props 子组件props
 * @param propName 绑定的属性名
 * @param emit emit函数
 * @returns
 */
export function useVModal(props: any, propName: string, emit: any) {
  return computed({
    get() {
      return new Proxy(props[propName], {
        get(targrt, key) {
          return Reflect.get(targrt, key)
        },
        set(targrt, key, newVal) {
          emit('update:' + propName, {
            ...targrt,
            [key]: newVal
          })
          return true
        }
      })
    },
    set(val) {
      emit('update:' + propName, val)
    }
  })
}

/**
 * @description 通用表格列表参数配置
 * @param pageSize 页容量
 * @returns 
 */
export function useTable<T>(pageSize = 10) {
  const tableParams = ref({
    /** 页码 */
    pageNo: 1,
    /** 页容量 */
    pageSize
  })
  const tableData = ref({
    /** 总数 */
    total: 0,
    /** 当前展示数据 */
    data: [] as T
  })

  /** 页码切换 */
  const handleUpdatePage = (page: number) => {
    tableParams.value.pageNo = page
  }
  
  /** 页容量切换 */
  const  handleUpdatePageSize = (pageSize: number) => {
    tableParams.value.pageSize = pageSize
  }

  return {
    tableParams,
    tableData,
    handleUpdatePage,
    handleUpdatePageSize
  }
}